<template>
	<!-- 报修详情 -->
	<view class="scan-check">
		<view class="scan-head">
			<view class="input-content">
				<view class="assetListItem">
					<view class="itemHead">
						<view class="itemHeadTitle">
							{{assetDetail.assetName}}
						</view>
						<view class="itemHeadState"
							:class="assetDetail.statusCh=='使用中'?'color-b-bg':assetDetail.statusCh=='闲置中'?'color-p-bg':assetDetail.statusCh=='已报废'||assetDetail.statusCh=='故障中'?'color-r-bg':'color-y-bg'">
							{{assetDetail.statusCh?assetDetail.statusCh:'未知'}}
						</view>
					</view>
					<view class="itemContent">
						<view class="conCenter">
							<view>资产类型：<view class="v-m color-green">{{assetDetail.assetTypeCh}}</view>
							</view>
							<view>资产编号：{{assetDetail.assetNo}}</view>
							<view>存放位置：{{assetDetail.storageLocationName}}</view>
							<view>出厂日期：{{assetDetail.manufactureDate}}</view>
							<view>购入期限：{{assetDetail.purchaseDate}}</view>
							<view>维保期限：{{assetDetail.warrantyExpires}}</view>
							<view style="color: #999;">备注信息：{{assetDetail.remarks}}</view>
						</view>
					</view>
				</view>
			</view>
		</view>
		<view class="form-content">
			<uni-forms ref="customForm" :modelValue="customFormData" :rules="customRules">
				<!-- <uni-forms-item label="紧急程度">
						<uni-data-select
						        v-model="customFormData.urgencyLevel"
						        :localdata="range"
						        :clear="true"
						      ></uni-data-select>
							  
					</uni-forms-item> -->
				<!-- <uni-forms-item label="期望日期">
						<uni-datetime-picker type="date" v-model="customFormData.applyExpectDate" @change="changeDate" :start="startDate" />
					</uni-forms-item> -->
				<uni-forms-item label="故障描述">
					<uni-easyinput type="textarea" v-model="customFormData.remarks" placeholder="">
					</uni-easyinput>
				</uni-forms-item>
				<!-- <uni-forms-item label="附件">
						<uni-file-picker file-mediatype="image" ref="files" :auto-upload="false" mode="grid" :limit="9"
							@select="select" @delete="deleteFile" title="最多选择9张图片" />
					</uni-forms-item> -->
			</uni-forms>
		</view>

		<view :class="{'bottom-btn':true,'permission-none':isPermission('ASS_APP_INSERT')}">
			<button class="end-btn" @click="endCheckBtn"><text class="iconfont icon-jsontijiao"></text>提交</button>
		</view>

		<!-- 确认弹窗 -->
		<!-- <uni-popup ref="alertDialog" type="dialog">
			<uni-popup-dialog type="warning" cancelText="取消" confirmText="确认" title="" content="确认该报修申请吗？"
				@confirm="dialogConfirm"></uni-popup-dialog>
		</uni-popup> -->
		<MessageTip ref="messageTip" :tipContent="'确认该报修申请吗？'" @clickType="handleShowOrHideTip" />

	</view>
</template>

<script lang="ts" setup>
	import {
		ref
	} from 'vue'
	import {
		onLoad
	} from '@dcloudio/uni-app'
	import {
		submitRepair,
		submitRepair2,
		getStatus
	} from '@/common/api/repairEquipment.ts'
	import {
		getAssetDetail
	} from '@/common/api/assetCheckAPI.ts'
	import {
		batchUpload
	} from '@/common/util/request.ts'; //上传文件接口
	import {
		isPermission
	} from '@/common/util/common.ts'
	const messageTip = ref()
	const handleShowOrHideTip = (type: string) => {
		if (type == 'yes') {
			dialogConfirm()
		}
	}
	const customRules = []
	let customFormData = ref({})
	const startDate = ref((new Date()).getTime());
	const range = ref([{
			value: 1,
			text: '一般'
		},
		{
			value: 2,
			text: '紧急'
		},
		{
			value: 3,
			text: '非常紧急'
		},
	])
	// const route = useRoute()
	const alertDialog = ref(null)
	const imgPath = ref([]);
	let assetDetail = ref({})

	const scanValue = ref()

	onLoad((params => {
		scanValue.value = params.scanResult
		// 扫一扫
		if (params.scanResult) {
			getAssetDetail({
				assetNo: params.scanResult
			}).then((res: any) => {
				if (res.code == 0) {
					assetDetail.value = res.data
				}
			})
		}
		// 从资产列表跳转过来
		if (params.assetData) {
			assetDetail.value = JSON.parse(params.assetData)
		}

	}))

	getStatus('UrgencyLevel').then((res: any) => {
		if (res.code == 0) {
			range.value = res.data.UrgencyLevel.map(item => {
				return {
					value: item.code / 1,
					text: item.value
				}
			})
			console.log(range.value);
		}
	})

	//选择文件
	const select = (res) => {
		imgPath.value = imgPath.value.concat(res.tempFilePaths);
	}
	//删除文件
	const deleteFile = (res) => {
		imgPath.value.forEach((em: any, i: Number) => {
			if (em == res.tempFilePath) {
				imgPath.value.splice(i, 1)
			}
		})
	}
	// 提交
	const endCheckBtn = () => {
		messageTip.value.openTip()
	}
	const changeDate = (e) => {
		customFormData.value.applyExpectDate = e;
	}
	const dialogConfirm = async () => {
		// let sysEnclRequestList = []; //附件列表
		// if (imgPath.value.length > 0) {

		// 	await batchUpload(imgPath.value).then((res: any) => {
		// 		let resData = JSON.parse(res);
		// 		if (resData.code == 0) {
		// 			resData.data.forEach((em: any) => {
		// 				sysEnclRequestList.push({
		// 					enclMode:0,
		// 					enclType: 2, //附件类型 2：图片 3：视频
		// 					enclUrl: em.path,
		// 					operType: 2, //	操作符:0-不变,1-删除,2-新增,3-修改
		// 				})
		// 			})
		// 		} else {
		// 			// 上传文件失败！
		// 			uni.showToast({
		// 				title: res.message,
		// 				icon:'none'
		// 			});

		// 		}
		// 	})
		// }
		// delete assetDetail.value.sysEnclResponses;
		submitRepair({
			applyUnits: assetDetail.value.storageLocation,
			applyUnitsType: '',
			assetApplyType: 4, //运维报修
			dtls: [{
				...assetDetail.value,
				// urgencyLevel:customFormData.value.urgencyLevel,
				remarks: customFormData.value.remarks,
				// applyExpectDate:customFormData.value.applyExpectDate,
				// sysEnclRequestList:sysEnclRequestList
			}]
		}).then((res: any) => {
			if (res.code == 0) {
				submitRepair2([{
					assetApplyId: res.data.assetApplyId,
					version: res.data.version
				}]).then((res2: any) => {
					if (res2.code == 0) {
						uni.showToast({
							title: res2.message,
							icon: 'none',
							duration: 500
						})
						setTimeout(() => {
							uni.navigateTo({
								url: '/pages/assets/assetManage/index',
							})
						}, 500)
					}
				})
			} else {
				uni.showToast({
					title: res.message,
					icon: 'none',
				})
			}
		});
	}
</script>

<style lang="scss" scoped>
	:deep(.uni-datetime-picker--btn) {
		background-color: #016751 !important;
	}

	:deep(.uni-calendar-item--checked) {
		background-color: #016751 !important;
	}

	.assetListItem {
		background-color: #fff;
		border-radius: 5px;
		box-shadow: 2px 2px 2px #eee;
		border-bottom: 1px solid #ddd;
	}

	.itemHead {
		border-bottom: 1px solid #ddd;
	}

	.itemHeadTitle {
		text-indent: 15px;
		box-sizing: border-box;
		padding-right: 80px;
		height: 35px;
		line-height: 40px;
		font-weight: bold;
		color: #333;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
		display: inline-block;
	}

	.itemHeadState {
		float: right;
		font-size: 11px;
		color: #fff;
		padding: 2px 12px;
		border-radius: 15px 0 0 15px;
		margin-top: 10px;
	}

	.itemContent {
		box-sizing: border-box;
		font-size: 15px;
		padding: 10px;
		border-bottom: 1px solid #eee;
		display: flex;
		flex-wrap: row nowrap;
	}

	.itemContent>view:nth-child(1) {
		width: 85%;
		padding-left: 15px;
		color: #333;
	}

	.itemContent>view:nth-child(1)>view {
		padding: 3px 0;
		text-overflow: ellipsis;
		white-space: nowrap;
		overflow: hidden;
		cursor: pointer;
	}

	.itemContent>view:nth-child(2) {
		width: 15%;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.scan-check {
		width: 100%;
		height: 94%;
		background-color: #fff;
		overflow: auto;

		.scan-head {
			// height: 400rpx;
			background: url(../../../src/static/img/bg1.png) no-repeat;
			background-size: 100% 100%;
			margin-bottom: 30rpx;
			margin-top: 30rpx;
		}

		.end-btn {
			width: 60%;
			border-radius: 30px;
			box-sizing: border-box;
			line-height: 2;
			background-color: #fd8f1a;
			color: #fff;
		}

		.input-content {
			background-color: #fff;
			width: 90vw;
			margin-left: 5vw;
			border-radius: 10rpx;
			box-shadow: (0, 0, 0, 0.08) 0px 0px 3px 1px;
			box-sizing: border-box;
			border: 1px solid #eee;
		}

		.form-content {
			background-color: #fff;
			// margin-top: 100rpx;
			padding: 40rpx;
		}

		.detail-btn {
			display: flex;
			justify-content: center;

			.end-btn {
				margin: 550rpx 50rpx 0 50rpx;
				line-height: 2;
				background-color: #fd8f1a;
				color: #fff;
			}
		}

		.iconfont {
			margin-right: 20rpx;
		}

		.uni-stat__select {
			padding: 0;
		}

		:deep(.uni-select__input-text) {
			width: 470rpx !important;
		}

		:deep(.uni-stat__actived) {
			outline: none;
		}
	}
</style>
